import tools from '../../../utils/tools'
import cartItem from './../../../template/cartItem.tpl'
import Event from './Event'

@tools
export default class Render {
  constructor(oCart, courseData, cartData, observer) {
    this.oCart = oCart
    this.courseData = courseData
    this.cartData = cartData
    this.observer = observer

    this.init()
  }
  init() {
    this.render()

    new Event(this.oCart, this.courseData, this.cartData, this.observer)
  }

  render() {
    const oFrag = document.createDocumentFragment()

    this.cartData.forEach((item) => {
      oFrag.appendChild(
        Render.createElement(
          'li',
          Render.tplReplace(cartItem, {
            id: item.id,
            title: item.title,
            price: `￥${item.price}.00`,
            coupon: item.coupon ? `￥${item.coupon}.00` : '暂无优惠券',
            // disabled: item.state ? 'disabled' : '',
            // btnText: item.state ? '已添加' : '加入购物车',
          })
        )
      )
    })

    // 将文档碎片添加到课程列表容器
    this.oCart.appendChild(oFrag)
  }
}
